<!DOCTYPE html>
<html lang="en">
  <head>
    <title>anim  Reference</title>
    <link rel="stylesheet" type="text/css" href="css/jazzy.css" />
    <link rel="stylesheet" type="text/css" href="css/highlight.css" />
    <meta charset='utf-8'>
    <script src="js/jquery.min.js" defer></script>
    <script src="js/jazzy.js" defer></script>
    
  </head>
  <body>
    <a title="anim  Reference"></a>
    <header>
      <div class="content-wrapper">
        <p><a href="index.html">anim Docs</a> (100% documented)</p>
      </div>
    </header>
    <div class="content-wrapper">
      <p id="breadcrumbs">
        <a href="index.html">anim Reference</a>
        <img id="carat" src="img/carat.png" />
        anim  Reference
      </p>
    </div>
    <div class="content-wrapper">
      <nav class="sidebar">
        <ul class="nav-groups">
          <li class="nav-group-name">
            <a href="Classes.html">Classes</a>
            <ul class="nav-group-tasks">
              <li class="nav-group-task">
                <a href="Classes/anim.html">anim</a>
              </li>
            </ul>
          </li>
          <li class="nav-group-name">
            <a href="Enums.html">Enums</a>
            <ul class="nav-group-tasks">
              <li class="nav-group-task">
                <a href="Enums/AnimatorType.html">AnimatorType</a>
              </li>
            </ul>
          </li>
          <li class="nav-group-name">
            <a href="Protocols.html">Protocols</a>
            <ul class="nav-group-tasks">
              <li class="nav-group-task">
                <a href="Protocols/Animator.html">Animator</a>
              </li>
            </ul>
          </li>
          <li class="nav-group-name">
            <a href="Structs.html">Structs</a>
            <ul class="nav-group-tasks">
              <li class="nav-group-task">
                <a href="Structs/animEase.html">animEase</a>
              </li>
              <li class="nav-group-task">
                <a href="Structs/animSettings.html">animSettings</a>
              </li>
            </ul>
          </li>
          <li class="nav-group-name">
            <a href="Typealiases.html">Typealiases</a>
            <ul class="nav-group-tasks">
              <li class="nav-group-task">
                <a href="Typealiases.html#/s:4anim0A7Closurea">animClosure</a>
              </li>
            </ul>
          </li>
        </ul>
      </nav>
      <article class="main-content">
        <section>
          <section class="section">
            
            <p><img src="https://github.com/onurersel/anim/raw/master/img/logo.png" alt="anim: Swift animation library for iOS, tvOS and macOS." width="446"></p>

<hr>

<p><a href="https://cocoapods.org/pods/anim"><img src="https://img.shields.io/cocoapods/v/anim.svg" alt="CocoaPods"></a>
<a href="https://github.com/Carthage/Carthage"><img src="https://img.shields.io/badge/Carthage-compatible-4BC51D.svg?style=flat" alt="Carthage compatible"></a>
<a href="https://travis-ci.org/onurersel/anim"><img src="https://travis-ci.org/onurersel/anim.svg?branch=master" alt="Build Status"></a>
<a href="https://codecov.io/github/onurersel/anim?branch=master"><img src="https://codecov.io/github/onurersel/anim/coverage.svg?branch=master" alt="codecov.io"></a>
<a href="https://codebeat.co/projects/github-com-onurersel-anim"><img src="https://codebeat.co/badges/67e95eda-c701-43d0-921c-541a427750bd" alt="codebeat badge"></a></p>

<p><code>anim</code> is an animation library written in Swift with a simple, declarative API in mind.</p>
<pre class="highlight swift"><code><span class="c1">// moves box to 100,100 with default settings</span>
<span class="n">anim</span> <span class="p">{</span>
    <span class="k">self</span><span class="o">.</span><span class="n">box</span><span class="o">.</span><span class="n">frame</span><span class="o">.</span><span class="n">origin</span> <span class="o">=</span> <span class="kt">CGPoint</span><span class="p">(</span><span class="nv">x</span><span class="p">:</span><span class="mi">100</span><span class="p">,</span> <span class="nv">y</span><span class="p">:</span><span class="mi">100</span><span class="p">)</span>
<span class="p">}</span>
<span class="c1">// after that, waits 100 ms</span>
<span class="o">.</span><span class="nf">wait</span><span class="p">(</span><span class="mf">0.1</span><span class="p">)</span>
<span class="c1">// moves box to 0,0 after waiting</span>
<span class="o">.</span><span class="n">then</span> <span class="p">{</span>
    <span class="k">self</span><span class="o">.</span><span class="n">box</span><span class="o">.</span><span class="n">frame</span><span class="o">.</span><span class="n">origin</span> <span class="o">=</span> <span class="kt">CGPoint</span><span class="p">(</span><span class="nv">x</span><span class="p">:</span><span class="mi">0</span><span class="p">,</span> <span class="nv">y</span><span class="p">:</span><span class="mi">0</span><span class="p">)</span>
<span class="p">}</span>
<span class="c1">// displays message after all animations are done</span>
<span class="o">.</span><span class="n">callback</span> <span class="p">{</span>
    <span class="nf">print</span><span class="p">(</span><span class="s">"Just finished moving 📦 around."</span><span class="p">)</span>
<span class="p">}</span>
</code></pre>

<p>It supports a bunch of easing functions and chaining multiple animations. It&rsquo;s a wrapper on Apple&rsquo;s <code>UIViewPropertyAnimator</code> on its core, and falls back to <code>UIView.animate</code> on versions before iOS and tvOS 10.
It uses <code>NSAnimationContext</code> on macOS.</p>
<h4 id='examples' class='heading'>Examples</h4>

<p>Example projects are available at <code>examples/</code> folder and as targets on XCode project.</p>

<p><img src="https://github.com/onurersel/anim/raw/master/img/example-bonfire.gif"  align="left" alt="Bonfire" width="135">
<img src="https://github.com/onurersel/anim/raw/master/img/example-profile.gif"  align="left" alt="Profile" width="135">
<img src="https://github.com/onurersel/anim/raw/master/img/example-menu.gif"  align="left" alt="Menu" width="135">
<img src="https://github.com/onurersel/anim/raw/master/img/example-message.gif"  alt="Message" width="135"></p>

<hr>

<p><img src="https://github.com/onurersel/anim/raw/master/img/installation.png" alt="Installation" width="293"></p>
<h4 id='cocoapods' class='heading'>Cocoapods</h4>
<pre class="highlight ruby"><code><span class="n">pod</span> <span class="s1">'anim'</span>
</code></pre>
<h4 id='carthage' class='heading'>Carthage</h4>
<pre class="highlight plaintext"><code>github "onurersel/anim"
</code></pre>
<h4 id='manually' class='heading'>Manually</h4>

<p>Or simply drag the swift files inside <code>src/</code> folder into your project.</p>

<hr>

<p><img src="https://github.com/onurersel/anim/raw/master/img/api.png" alt="API" width="127"></p>

<p>For complete documentation, visit <a href="http://onurersel.github.io/anim/">http://onurersel.github.io/anim/</a>.</p>

<p>Initialize animations with <code>anim</code> constructor.</p>
<pre class="highlight swift"><code><span class="c1">// Initialize with default settings</span>
<span class="n">anim</span> <span class="p">{</span>
    <span class="c1">// animation block</span>
<span class="p">}</span>
</code></pre>
<pre class="highlight swift"><code><span class="c1">// or initialize with it's own settings</span>
<span class="n">anim</span> <span class="p">{</span> <span class="p">(</span><span class="n">settings</span><span class="p">)</span> <span class="o">-&gt;</span> <span class="p">(</span><span class="n">animClosure</span><span class="p">)</span> <span class="k">in</span>
    <span class="n">settings</span><span class="o">.</span><span class="n">delay</span> <span class="o">=</span> <span class="mi">1</span>
    <span class="n">settings</span><span class="o">.</span><span class="n">duration</span> <span class="o">=</span> <span class="mf">0.7</span>
    <span class="n">settings</span><span class="o">.</span><span class="n">ease</span> <span class="o">=</span> <span class="o">.</span><span class="n">easeInOutBack</span>

    <span class="k">return</span> <span class="p">{</span>
        <span class="c1">// animation block</span>
    <span class="p">}</span>
<span class="p">}</span>
</code></pre>
<pre class="highlight swift"><code><span class="c1">// or initialize layout constraint animations just by passing the parent view</span>
<span class="nf">anim</span><span class="p">(</span><span class="nv">constraintParent</span><span class="p">:</span> <span class="k">self</span><span class="o">.</span><span class="n">view</span><span class="p">)</span> <span class="p">{</span>
    <span class="c1">// animation block</span>
<span class="p">}</span>

<span class="nf">anim</span><span class="p">(</span><span class="nv">constraintParent</span><span class="p">:</span> <span class="k">self</span><span class="o">.</span><span class="n">view</span><span class="p">)</span> <span class="p">{</span> <span class="p">(</span><span class="n">settings</span><span class="p">)</span> <span class="o">-&gt;</span> <span class="p">(</span><span class="n">animClosure</span><span class="p">)</span> <span class="k">in</span>
    <span class="c1">// settings...</span>
    <span class="k">return</span> <span class="p">{</span>
        <span class="c1">// animation block</span>
    <span class="p">}</span>
<span class="p">}</span>

<span class="c1">// you don't need to call layoutIfNeeded() before or inside the</span>
<span class="c1">// animation blocks, it's handled by anim</span>
<span class="c1">//</span>
<span class="c1">// for example to update constant value of a constraint,</span>
<span class="c1">// you can just change it inside the animation block</span>
<span class="k">let</span> <span class="nv">width</span><span class="p">:</span> <span class="kt">NSLayoutConstraint</span> <span class="c1">//...</span>
<span class="nf">anim</span><span class="p">(</span><span class="nv">constraintParent</span><span class="p">:</span> <span class="k">self</span><span class="o">.</span><span class="n">view</span><span class="p">)</span> <span class="p">{</span>
    <span class="n">width</span><span class="o">.</span><span class="n">constant</span> <span class="o">=</span> <span class="mi">100</span> <span class="c1">// new value</span>
<span class="p">}</span>
<span class="c1">// that's it!</span>
</code></pre>

<p>Chain animations with <code>then</code> function.</p>
<pre class="highlight swift"><code><span class="n">anim</span> <span class="p">{}</span>
<span class="o">.</span><span class="n">then</span><span class="p">{</span>
    <span class="c1">// next animation block</span>
<span class="p">}</span>
</code></pre>
<pre class="highlight swift"><code><span class="n">anim</span> <span class="p">{}</span>
<span class="o">.</span><span class="n">then</span> <span class="p">{</span> <span class="p">(</span><span class="n">settings</span><span class="p">)</span> <span class="o">-&gt;</span> <span class="n">animClosure</span> <span class="k">in</span>
    <span class="n">settings</span><span class="o">.</span><span class="n">duration</span> <span class="o">=</span> <span class="mi">1</span>
    <span class="k">return</span> <span class="p">{</span>
        <span class="c1">// next animation block</span>
    <span class="p">}</span>
<span class="p">}</span>
</code></pre>
<pre class="highlight swift"><code><span class="n">anim</span> <span class="p">{}</span>
<span class="o">.</span><span class="nf">then</span><span class="p">(</span><span class="nv">constraintParent</span><span class="p">:</span> <span class="k">self</span><span class="o">.</span><span class="n">view</span><span class="p">)</span> <span class="p">{</span>
    <span class="c1">// chaining constraint animations</span>
<span class="p">}</span>
<span class="o">.</span><span class="nf">then</span><span class="p">(</span><span class="nv">constraintParent</span><span class="p">:</span> <span class="k">self</span><span class="o">.</span><span class="n">view</span><span class="p">)</span> <span class="p">{</span> <span class="p">(</span><span class="n">settings</span><span class="p">)</span> <span class="o">-&gt;</span> <span class="n">animClosure</span> <span class="k">in</span>
    <span class="n">settings</span><span class="o">.</span><span class="n">duration</span> <span class="o">=</span> <span class="mi">1</span>
    <span class="k">return</span> <span class="p">{</span>
        <span class="c1">// next animation block for constraints</span>
    <span class="p">}</span>
<span class="p">}</span>
</code></pre>

<p>Wait between animation steps with <code>wait</code> function.</p>
<pre class="highlight swift"><code><span class="n">anim</span><span class="p">{}</span><span class="o">.</span><span class="nf">wait</span><span class="p">(</span><span class="mf">0.25</span><span class="p">)</span><span class="o">.</span><span class="n">then</span><span class="p">{}</span> <span class="c1">//...</span>
</code></pre>

<p>Insert callbacks between animation steps with <code>.callback</code> function.</p>
<pre class="highlight swift"><code><span class="n">anim</span><span class="p">{}</span>
<span class="o">.</span><span class="n">callback</span> <span class="p">{</span>
    <span class="c1">// custom block</span>
<span class="p">}</span>
<span class="o">.</span><span class="n">then</span><span class="p">{}</span> <span class="c1">//...</span>
</code></pre>

<p>Stop animations with <code>stop</code> function.</p>
<pre class="highlight swift"><code><span class="k">let</span> <span class="nv">animation</span> <span class="o">=</span> <span class="n">anim</span><span class="p">{}</span><span class="o">.</span><span class="n">then</span><span class="p">{}</span> <span class="c1">// ...</span>
<span class="n">animation</span><span class="o">.</span><span class="nf">stop</span><span class="p">()</span>
</code></pre>
<h4 id='default-settings' class='heading'>Default settings</h4>

<p>You can change default animation settings through <code>anim.defaultSettings</code> property.</p>
<pre class="highlight swift"><code><span class="n">anim</span><span class="o">.</span><span class="n">defaultSettings</span><span class="o">.</span><span class="n">ease</span> <span class="o">=</span> <span class="o">.</span><span class="n">easeInOutCubic</span>
</code></pre>
<h4 id='easing' class='heading'>Easing</h4>

<p><code>anim.Ease</code> exposes a bunch of easing options.</p>

<hr>

<p><img src="https://github.com/onurersel/anim/raw/master/img/roadmap.png" alt="Roadmap" width="286"></p>

<ul>
<li>[x] Chaining animations</li>
<li>[x] Wait, callback functions</li>
<li>[x] Constraint animations</li>
<li>[x] iOS 8 and 9 support</li>
<li>[x] macOS support</li>
<li>[x] tvOS support</li>
<li>[x] Example projects</li>
<li>[ ] API for choreographing animations</li>
<li>[ ] Grouping animations</li>
<li>[ ] Easing with spring</li>
<li>[ ] Shape animations</li>
</ul>

<hr>

<p><img src="https://github.com/onurersel/anim/raw/master/img/license.png" alt="License" width="163"></p>

<p><code>anim</code> is released under the MIT license. See LICENSE for details.</p>

          </section>
        </section>
        <section id="footer">
          <p>&copy; 2017 <a class="link" href="https://github.com/onurersel/anim" target="_blank" rel="external">Onur Ersel</a>. All rights reserved. (Last updated: 2017-09-29)</p>
          <p>Generated by <a class="link" href="https://github.com/realm/jazzy" target="_blank" rel="external">jazzy ♪♫ v0.8.3</a>, a <a class="link" href="http://realm.io" target="_blank" rel="external">Realm</a> project.</p>
        </section>
      </article>
    </div>
  </body>
</div>
</html>
